<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        #return{
            width:40px;
            height:40px;
            line-height: 40px;
            text-align: center;
            border-radius: 50%;
            background-color: #D9D9D9;
            position: fixed;
            right:15px;
            bottom:15px;
            cursor: pointer;
            opacity: 0.6;
        }


    </style>
</head>
<body>
<div>
    <button id="btn">点我跳转到锚点</button>
    <button id="btn2">点我跳转到中间</button>
    <h2>相对论1</h2>
    （英语：Theory of relativity）是关于时空和引力的理论，
    主要由爱因斯坦创立，依其研究对象的不同可分为狭义相对论和广义相对论。
    相对论和量子力学的提出给物理学带来了革命性的变化，它们共同奠定了现代物理学的基础。
    相对论极大地改变了人类对宇宙和自然的“常识性”观念，提出了“同时的相对性”、“四维时空”、
    “弯曲时空”等全新的概念。不过近年来，人们对于物理理论的分类有了一种新的认识——以其理论
    是否是决定论的来划分经典与非经典的物理学，即“非经典的=量子的”。
    在这个意义下，相对论仍然是一种经典的理论。
    狭义与广义相对论的分别编辑 播报
    传统上，在爱因斯坦刚刚提出相对论的初期，人们以所讨论的问题是否涉及非惯性参考系来作为狭义
    与广义相对论分类的标志。随着相对论理论的发展，这种分类方法越来越显出其缺点——参考系是
    跟观察者有关的，以这样一个相对的物理对象来划分物理理论，被认为不能反映问题的本质。
    一般认为，狭义与广义相对论的区别在于所讨论的问题是否涉及引力（弯曲时空），
    即狭义相对论只涉及那些没有引力作用或者引力作用可以忽略的问题，而广义相对论则是讨论有引力
    作用时的物理学。用相对论的语言来说，就是狭义相对论的背景时空是平直的，即四维平凡流型配以
    闵氏度规，其曲率张量为零，又称闵氏时空；而广义相对论的背景时空则是弯曲的，
    其曲率张量不为零。
    <h2 id = "test">相对论2</h2>
    （英语：Theory of relativity）是关于时空和引力的理论，
    主要由爱因斯坦创立，依其研究对象的不同可分为狭义相对论和广义相对论。
    相对论和量子力学的提出给物理学带来了革命性的变化，它们共同奠定了现代物理学的基础。
    相对论极大地改变了人类对宇宙和自然的“常识性”观念，提出了“同时的相对性”、“四维时空”、
    “弯曲时空”等全新的概念。不过近年来，人们对于物理理论的分类有了一种新的认识——以其理论
    是否是决定论的来划分经典与非经典的物理学，即“非经典的=量子的”。
    在这个意义下，相对论仍然是一种经典的理论。
    狭义与广义相对论的分别编辑 播报
    传统上，在爱因斯坦刚刚提出相对论的初期，人们以所讨论的问题是否涉及非惯性参考系来作为狭义
    与广义相对论分类的标志。随着相对论理论的发展，这种分类方法越来越显出其缺点——参考系是
    跟观察者有关的，以这样一个相对的物理对象来划分物理理论，被认为不能反映问题的本质。
    一般认为，狭义与广义相对论的区别在于所讨论的问题是否涉及引力（弯曲时空），
    即狭义相对论只涉及那些没有引力作用或者引力作用可以忽略的问题，而广义相对论则是讨论有引力
    作用时的物理学。用相对论的语言来说，就是狭义相对论的背景时空是平直的，即四维平凡流型配以
    闵氏度规，其曲率张量为零，又称闵氏时空；而广义相对论的背景时空则是弯曲的，
    其曲率张量不为零。
    <h2>相对论3</h2>
    （英语：Theory of relativity）是关于时空和引力的理论，
    主要由爱因斯坦创立，依其研究对象的不同可分为狭义相对论和广义相对论。
    相对论和量子力学的提出给物理学带来了革命性的变化，它们共同奠定了现代物理学的基础。
    相对论极大地改变了人类对宇宙和自然的“常识性”观念，提出了“同时的相对性”、“四维时空”、
    “弯曲时空”等全新的概念。不过近年来，人们对于物理理论的分类有了一种新的认识——以其理论
    是否是决定论的来划分经典与非经典的物理学，即“非经典的=量子的”。
    在这个意义下，相对论仍然是一种经典的理论。
    狭义与广义相对论的分别编辑 播报
    传统上，在爱因斯坦刚刚提出相对论的初期，人们以所讨论的问题是否涉及非惯性参考系来作为狭义
    与广义相对论分类的标志。随着相对论理论的发展，这种分类方法越来越显出其缺点——参考系是
    跟观察者有关的，以这样一个相对的物理对象来划分物理理论，被认为不能反映问题的本质。
    一般认为，狭义与广义相对论的区别在于所讨论的问题是否涉及引力（弯曲时空），
    即狭义相对论只涉及那些没有引力作用或者引力作用可以忽略的问题，而广义相对论则是讨论有引力
    作用时的物理学。用相对论的语言来说，就是狭义相对论的背景时空是平直的，即四维平凡流型配以
    闵氏度规，其曲率张量为零，又称闵氏时空；而广义相对论的背景时空则是弯曲的，
    其曲率张量不为零。
    <h2>相对论4</h2>
    （英语：Theory of relativity）是关于时空和引力的理论，
    主要由爱因斯坦创立，依其研究对象的不同可分为狭义相对论和广义相对论。
    相对论和量子力学的提出给物理学带来了革命性的变化，它们共同奠定了现代物理学的基础。
    相对论极大地改变了人类对宇宙和自然的“常识性”观念，提出了“同时的相对性”、“四维时空”、
    “弯曲时空”等全新的概念。不过近年来，人们对于物理理论的分类有了一种新的认识——以其理论
    是否是决定论的来划分经典与非经典的物理学，即“非经典的=量子的”。
    在这个意义下，相对论仍然是一种经典的理论。
    狭义与广义相对论的分别编辑 播报
    传统上，在爱因斯坦刚刚提出相对论的初期，人们以所讨论的问题是否涉及非惯性参考系来作为狭义
    与广义相对论分类的标志。随着相对论理论的发展，这种分类方法越来越显出其缺点——参考系是
    跟观察者有关的，以这样一个相对的物理对象来划分物理理论，被认为不能反映问题的本质。
    一般认为，狭义与广义相对论的区别在于所讨论的问题是否涉及引力（弯曲时空），
    即狭义相对论只涉及那些没有引力作用或者引力作用可以忽略的问题，而广义相对论则是讨论有引力
    作用时的物理学。用相对论的语言来说，就是狭义相对论的背景时空是平直的，即四维平凡流型配以
    闵氏度规，其曲率张量为零，又称闵氏时空；而广义相对论的背景时空则是弯曲的，
    其曲率张量不为零。
    <h2>相对论5</h2>
    （英语：Theory of relativity）是关于时空和引力的理论，
    主要由爱因斯坦创立，依其研究对象的不同可分为狭义相对论和广义相对论。
    相对论和量子力学的提出给物理学带来了革命性的变化，它们共同奠定了现代物理学的基础。
    相对论极大地改变了人类对宇宙和自然的“常识性”观念，提出了“同时的相对性”、“四维时空”、
    “弯曲时空”等全新的概念。不过近年来，人们对于物理理论的分类有了一种新的认识——以其理论
    是否是决定论的来划分经典与非经典的物理学，即“非经典的=量子的”。
    在这个意义下，相对论仍然是一种经典的理论。
    狭义与广义相对论的分别编辑 播报
    传统上，在爱因斯坦刚刚提出相对论的初期，人们以所讨论的问题是否涉及非惯性参考系来作为狭义
    与广义相对论分类的标志。随着相对论理论的发展，这种分类方法越来越显出其缺点——参考系是
    跟观察者有关的，以这样一个相对的物理对象来划分物理理论，被认为不能反映问题的本质。
    一般认为，狭义与广义相对论的区别在于所讨论的问题是否涉及引力（弯曲时空），
    即狭义相对论只涉及那些没有引力作用或者引力作用可以忽略的问题，而广义相对论则是讨论有引力
    作用时的物理学。用相对论的语言来说，就是狭义相对论的背景时空是平直的，即四维平凡流型配以
    闵氏度规，其曲率张量为零，又称闵氏时空；而广义相对论的背景时空则是弯曲的，
    其曲率张量不为零。
    <div id = "return">顶</div>
</div>
<script>
    // 获取目标元素
    let element = document.getElementById('test');
    let btn = document.getElementById('btn');
    let btn2 = document.getElementById('btn2');
    let ret = document.getElementById('return');

    // 计算元素在页面中的位置
    let topPosition = element.getBoundingClientRect().top + window.pageYOffset;

    // 设置滚动动画，平滑滚动到指定位置
    btn.addEventListener('click', function () {
        window.requestAnimationFrame(function () {
            window.scrollTo({
                top: topPosition,
                behavior: 'smooth'
            });
        });
    })

    ret.addEventListener('click', function () {
        window.requestAnimationFrame(function () {
            window.scrollTo(0,0);
        });
    })

    btn2.addEventListener('click', function () {
        console.log('btn2 click ')
        btn2.scrollIntoView({block:'center'})
    })

</script>
</body>
</html>
